/**
* @Descripttion: 未描述
* @Author: Chenbangquan
* @version: 1.0.0
* @CreateDate 2023-02-13 15:59
* @LastEditors: cbq
* @LastEditTime: 2023-02-13
*/
<template>
  <div>
    <!--<el-button type="primary" size="small" @click="startUp()">启动</el-button>-->
    <!--<el-button type="danger" size="small" @click="stopDown()">停机</el-button>-->
    <el-table border :data="tableData.value" style="width: 100%">
      <el-table-column width="60" type="index" label="序号"></el-table-column>
      <!--<el-table-column prop="id" label="ID"></el-table-column>-->
      <el-table-column width="100" prop="userName" label="昵称"></el-table-column>
      <el-table-column width="160" prop="phone" label="手机号">
        <template #default="scope">
          <div>
            <span>{{scope.row.phone}}</span>&nbsp;&nbsp;&nbsp;
            <a :href="`tel:${scope.row.phone}`">拨打</a>
          </div>
        </template>
      </el-table-column>
      <el-table-column width="110" prop="vehicleNo" label="车牌号"></el-table-column>

      <el-table-column  label="用户地址">
        <template #default="scope">
          <span>{{scope.row.address}}</span>
          <span @click="copy(scope.row.address)" style="color: #56a9ff">&nbsp;&nbsp;&nbsp;复制</span>
        </template>
      </el-table-column>
      <el-table-column prop="addressDetail" label="详细地址"></el-table-column>
      <el-table-column  label="支付状态">
        <template #default="scope">
          <span v-if="scope.row.status == 0">交易中</span>
          <span v-if="scope.row.status == 1">正在充电</span>
          <span v-if="scope.row.status == 4">未支付</span>
          <span v-if="scope.row.status == 5">已支付</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" >
        <template #default="scope">
          <el-button type="primary" size="small" @click="handleEdit(scope.$index, scope.row)">启动</el-button>
          <el-button type="danger" size="small" @click="stopDown()">停机</el-button>
          <el-button type="danger" size="small" @click="updateOrderPayState(scope.row)">同步支付状态</el-button>

          <!--<el-button type="danger" size="small" @click="handleDelete(scope.$index, scope.row)">停机</el-button>-->
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup lang="ts">
	import {ref,reactive,onMounted,getCurrentInstance,nextTick} from 'vue'
	import  eleApi from '@/api/electricityPandaApi/index'
  import { ElMessage } from 'element-plus'
  const tableFalse = ref(false)
  const resdata = reactive([])
  const dataArr = ref([])
  const tableData = reactive([])
  onMounted(()=>{
  	postSijiOrder()
  })
  const updateOrderPayState = async (val)=>{
	    let res = await eleApi.postUpdateOrderInfo({'orderNo':val.orderNo})
      if(res.data.code == 200){
          ElMessage({
              message: '同步成功!',
              type: 'success',
          })
      }
      console.log(res)
  }
	const copy =(text)=> {
		// text是复制文本
		// 创建input元素
		const el = document.createElement('input')
		// 给input元素赋值需要复制的文本
		el.setAttribute('value', text)
		// 将input元素插入页面
		document.body.appendChild(el)
		// 选中input元素的文本
		el.select()
		// 复制内容到剪贴板
		document.execCommand('copy')
		// 删除input元素
		document.body.removeChild(el)
      ElMessage({
          message: '复制成功!',
          type: 'success',
      })
	}
	const handleEdit = async (index,val)=>{
		let obj = {
			id: val.id
    }
		let res = await eleApi.update_Order_state(obj)
    if(res.data.code == 200){
	    // startUp()
    }

	}
	// 获取订单数据
  const postSijiOrder = async ()=>{
		let res = await eleApi.post_sj_orderList()
      resdata.value = JSON.parse(JSON.stringify(res.data.data.rows))
      resdata.value.forEach(async (item,index)=>{
          item.phone = ''
          item.address = ''
          item.userName = ''
          item.vehicleColor = ''
          item.vehicleNo = ''
          item.vehicleType = ''
    	let obj = {
		    openId:item.openid
      }
    	let data = await eleApi.getVehicleInfoByOpneid(obj)
          if(data.data.code == 200){
              data.data.data.openId = item.openid
              data.data.data.id = item.id
              dataArr.value.push(data.data.data)
              item.phone = data.data.data.phone
              item.address = data.data.data.address
              item.userName = data.data.data.userName
              item.vehicleColor = data.data.data.vehicleColor
              item.vehicleNo = data.data.data.vehicleNo
              item.vehicleType = data.data.data.vehicleType
              tableFalse.value = true

          }
          nextTick(()=>{
              if(index == resdata.value.length -1){
                  tableData.value = resdata.value
                  console.log(dataArr.value)
              }

          })
    })
  }
	const startUp = ()=>{
		let data = {
			accountBalance: 100,
			chargeNo: 1,
			equipmentNo: "0000000000001",
			logicalCardNo: "3036433345414141",
			phsicalCardNo: "3530303030303031",
			transactionNo: "55031412782305012018061914444680"
		}
	  let res = eleApi.startSys(data)
    console.log(res)
  }
  const stopDown = async ()=>{
		let data = {
			equipmentNo:'11000000000001',
			portNo:'1'
		}
	  let res = await eleApi.stopSys(data)
    console.log(res)
  }
</script>

<style scoped>

</style>
